<template>
	<view class="wrap" style="padding-bottom: 60px;">
		<watermark :text="shuiyin" opacity="0.3"></watermark>
		<drag-icon :isDock="true" :existTabBar="true" @btnClick="btnClick"></drag-icon>
		<cu-custom bgColor="bg-gradual-blue" :isBack="false">
			<block slot="content">消息中心</block>
		</cu-custom>

		<view>
			<u-sticky>
				<view class="search">
					<u-search class="hzuni-search-bar" v-model="keywords" @custom="search" @search="search"></u-search>
				</view>
			</u-sticky>

			<scroll-view class="scroll-list" scroll-y="true" :lower-threshold="10">
				<view class="uni-list">

					<!-- 待办 审批消息 start -->
					<template v-for="(item,index) in todoMessageList">
						<view :key="index" class="uni-list-cell"
							@click="navTo('/pages/msg/audit-item?bizType='+item.bizType)">
							<view class="uni-media-list">
								<view :class="[computerClassName(index)]">
									<i class="iconfont icon-msg-system"><u-badge bgColor='red' :absolute="badflag"
											type="error" :value="item.counts"></u-badge></i>
								</view>
								<view class="uni-media-list-body">
									<view class="uni-media-list-text-top">{{item.name}}

									</view>
									<view class="uni-media-list-text-bottom">
										<text>待办审批业务</text>
									</view>
								</view>
							</view>
						</view>
					</template>
					<!-- 待办 审批消息 end -->

					<!-- 待审阅消息 发通知 -->
					<view v-if="reviewedMesgCount>0" class="uni-list-cell"
						@click="navTo('/pages/msg/list-item?pageType=review')">
						<view class="uni-media-list">
							<view class="home-icon icon-color12">
								<i class="iconfont icon-tongzhi"><u-badge :absolute="badflag" type="error"
										:value="reviewedMesgCount"></u-badge></i>
							</view>
							<view class="uni-media-list-body">
								<view class="uni-media-list-text-top">待我审阅
								</view>
								<view class="uni-media-list-text-bottom">
									<text>日常审批转阅(退回)</span></text>
								</view>
							</view>
						</view>
					</view>


					<!-- 通知公告 -->
					<view class="uni-list-cell">
						<view class="uni-media-list" @click="navTo('/pages/msg/list-item?pageType=notice')">
							<view class="home-icon icon-color03">
								<i class="iconfont icon-tongzhi1"><u-badge :absolute="badflag" type="error"
										:value="noticeCount"></u-badge></i>
							</view>
							<view class="uni-media-list-body">
								<view class="uni-media-list-text-top">通知公告</view>
								<view class="uni-media-list-text-bottom">
									<text>关于公司内的日常通知</span></text>
								</view>
							</view>
						</view>
					</view>
				</view>

			</scroll-view>
		</view>




	</view>
</template>
<script>
	import dragIcon from '../../components/drag/drag-icon.vue'
	/**
	 * Copyright (c) 2013-Now http://aidex.vip All rights reserved.
	 */
	import {
		getTodoAction,
		getUser,
	} from '../../network/service/addressBook.js'

	import watermark from "../../components/watermark.vue"
	export default {
		components: {
			watermark,
			dragIcon
		},
		data() {
			return {
				scrollHeight: '',
				shuiyin: 'wwwww',
				keywords: '',
				badflag: true,
				todoMessageList: [],
				reviewedMesgCount: 0,
				noticeCount: 0,
			};
		},

		onReady() {
			this.computerheight()

		},
		created() {

			this.getTodoMesgList()
			this.getToReviewedMesgList()
			this.getNoticeList()
			const userInfo = getUser()
			this.shuiyin = userInfo.name + '' + userInfo.userName.substr(7, 11)
			//console.log("this.scrollHeight", this.scrollHeight)
			//this.scrollHeight = 60
			//this.computerheight()
			//console.log("this.scrollHeighthou", this.scrollHeight)
		},

		methods: {
			computerClassName(index) {
				let abc = 'home-icon icon-color0' + Number(index + 1)
				console.log(abc)
				return abc;
			},
			computerheight() {
				let screenW = 0
				let screenH = 0
				uni.getSystemInfo({
					success(res) {
						screenW = res.windowWidth
						screenH = res.windowHeight
					}
				})

				uni.createSelectorQuery().select('.search').boundingClientRect(data => {
					this.topHeight = data && data.height ? data.height : 60
					this.scrollHeight = (screenH - 80 - this.topHeight) * (750 / screenW) + 'rpx'
				}).exec()

			},
			btnClick() {
				this.getTodoMesgList()
				this.getToReviewedMesgList()
				this.getNoticeList()
			},
			navTo(url) {
				uni.navigateTo({
					url: url
				});
			},
			search(value) {
				this.$u.toast('搜索内容为：' + value)
				this.keywords = value
				this.getTodoMesgList(value)
				this.getToReviewedMesgList(value)
				this.getNoticeList(value)
			},
			backInit() {
				console.log("dfdg2222")
				this.getTodoMesgList()
				this.getToReviewedMesgList()
				this.getNoticeList()
			},
			/**
			 * 待办审批消息 查询
			 * @param {Object} keyword
			 */
			getTodoMesgList(keyword) {
				const userInfo = getUser()
				let params = {
					url: '/message/getUnReadMessageList',
					method: 'POST',
					data: {
						uid: userInfo.uid,
						companyId: userInfo.companyId,
						pageSize: 999,
						keyWord: keyword,
					},
				}
				getTodoAction(params).then(res => {
					this.todoMessageList = res.data.list
					this.$emit('mesgTotalCount', +this.todoMessageList.length + +this.reviewedMesgCount + +this
						.noticeCount)
				})

			},
			/**
			 * 待审阅的消息
			 * @param {Object} keyword
			 */
			getToReviewedMesgList(keyword) {
				const userInfo = getUser()
				let params = {
					url: '/message/getUnReadMessageInWork',
					method: 'POST',
					data: {
						type: 0,
						uid: userInfo.uid,
						companyId: userInfo.companyId,
						count: true,
						keyWord: keyword,
					},
				}
				getTodoAction(params).then(res => {
					this.reviewedMesgCount = res.data.total
					this.$emit('mesgTotalCount', +this.todoMessageList.length + +this.reviewedMesgCount + +this
						.noticeCount)
				})

			},

			/**
			 * 查询通知公告
			 */
			getNoticeList() {
				const userInfo = getUser()
				let params = {
					url: '/notice/getNoticeByCondition',
					method: 'POST',
					data: {
						createPerson: userInfo.person,
						roleIds: userInfo.roleIds,
						userRoleIds: userInfo.userRoleIds,
						requestType: "mobile",

					},
				}
				getTodoAction(params).then(res => {
					this.noticeCount = res.data.total
					this.$emit('mesgTotalCount', +this.todoMessageList.length + +this.reviewedMesgCount + +this
						.noticeCount)

				})
			}

		}
	};
</script>
<style lang="scss">
	@import '../../common/uni.css';

	page {
		background-color: #f5f5f5;
	}

	.wrap .search {
		background: #ffffff;
	}

	.search {
		padding: 14px;
		height: 64px;
	}

	.hzuni-search-bar {
		flex: 1;
		align-items: center;
		padding: 10rpx;
	}



	.uni-media-list {
		padding: 15px 15px;

	}

	.uni-media-list-body {
		height: 42px;
		padding-left: 20rpx;
	}

	.uni-media-list-text-top {
		height: 40rpx;
		overflow: hidden;
		width: 100%;
		line-height: 40rpx;
		font-size: 32rpx;
		display: flex;
		justify-content: space-between;
	}

	.uni-media-list-text-bottom {
		width: 100%;
		line-height: 24rpx;
		font-size: 26rpx;
		color: #666666;

		span {
			margin-right: 10rpx;
		}
	}
</style>